<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
  <meta charset="utf-8"/>
  <link rel="icon" href="img/logo.png">
  <title>订单查看</title>
  <meta http-equiv="pragma" content="no-cache">
  <meta http-equiv="cache-control" content="no-cache">
  <meta http-equiv="expires" content="0">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0"/>
  <!--腾讯地图选择器-->
  <link rel="stylesheet" href="layui/css/layui.css"/>
  <!--[if !IE]> -->
  <link rel="stylesheet" href="css/pace.css"/>
  <script data-pace-options='{ "ajax": true, "document": true, "eventLag": false, "elements": false }' src="js/pace.js"></script>
  <!-- <![endif]-->
  <link rel="stylesheet" href="css/bootstrap.css"/>
  <link rel="stylesheet" href="css/font-awesome.min.css"/>
  <!-- text fonts -->
  <link rel="stylesheet" href="css/ace-fonts.css"/>
  <!-- ace styles -->
  <link rel="stylesheet" href="css/ace.css" class="ace-main-stylesheet" id="main-ace-style"/>
  <!--[if lte IE 9]>
  <link rel="stylesheet" href="css/ace-part2.css" class="ace-main-stylesheet"/>
  <![endif]-->
  <!--[if lte IE 9]>
  <link rel="stylesheet" href="css/ace-ie.css"/>
  <![endif]-->
  <script src="js/ace-extra.js"></script>
  <!--[if lte IE 8]>
  <script src="js/html5shiv.js"></script>
  <script src="js/respond.js"></script>
  <![endif]-->
</head>
<body class="main-container" style="background:transparent;">
  <table id="tableListGoodsOrder" class="table table-striped table-bordered table-hover">
    <tbody>
      <tr>
        <td style="text-align:center;height:37px">正在加载……</td>
      </tr>
    </tbody>
  </table>
  <div id="div_order_info" style="display:none;padding-top:2px;margin-bottom:-20px;">
    <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true"></div>
  </div>
  <div style="display:none;">
    <input type="hidden" id="page_proxy_btn_listData"/>
    <input type="hidden" id="page_proxy_row_queryById"/>
    <input type="hidden" id="proxy_order_row_queryById"/>
  </div>
<!--[if !IE]> -->
<script src="js/jquery.js"></script>
<!-- <![endif]-->
<!--[if IE]>
<script src="js/jquery-1.12.4.min.js"></script>
<![endif]-->
<script src="js/jquery.xdomainrequest.min.js"></script>
<script src="js/jquery.placeholder.min.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/ace/ace.js"></script>
<script src="js/dataTables/jquery.dataTables.js"></script>
<script src="js/dataTables/jquery.dataTables.bootstrap.js"></script>
<script src="js/layer/layer.js"></script>
<script src="js/page.common.js"></script>
<script src="js/decimal.js"></script>
<script src="js/dataTables/datatable.lib.js"></script>
<script src="layui/layui.js"></script>
<script type="text/javascript">
  ;(function($){
    var userId = sessionStorage.getItem('userId');
    var storeId = sessionStorage.getItem('storeId');
    var accessToken = sessionStorage.getItem('accessToken');
    if(accessToken == null || accessToken == ''){
      layerFn.alert('暂无查看权限',AppKey.code.code199);
      $('#tableListGoodsOrder tbody tr td').text('暂无查看权限');
      return;
    }
    var tableDom = '#tableListGoodsOrder';
    var urlRoute = '/proxy/';/*请求controller层的url*/
    var getList = urlRoute + 'getViewOrder';/*获取数据列表*/
    var urlAdd = urlRoute + 'add';/*添加*/
    var urlEdit = urlRoute + 'edit';/*编辑*/
    var urlQueryById = urlRoute + 'getViewOrderInfo';/*根据id查询对应的数据*/
    var stateOriginal = {};
    var thisTable = null;
    thisPage = {
      init : function(){
        this.initTable();
        this.initDom();
        this.addEvent();
      },
      initDom : function(){},
      addEvent: function(){
        $(tableDom +' tbody').on('dblclick','td:not(:first-child,:last-child)',function(){//除去每行的第一个和最后一个单元格均可双击事件
          if(verifyFn.inputRequired('#page_proxy_row_edit')){
            return;
          }
          thisPage.trDblclick(thisTable.row($(this).parent()).data());
        });
        $('#btnAdd').on('click', function(){
          thisPage.edit();
        });
        //搜索按钮
        $('#btnSearch').on('click', function(){
          thisPage.search();
        });
        //重置按钮
        $('#btnReset').on('click', function(){
          $('#add_date_start').val('');
          $('#add_date_end').val('');
        });
        //按钮组-自定义显示列
        $('#iconColumn').parent().parent().on('click', function(){
          pageDataTable.columnCustom(thisTable, tableDom,'#divKeyColumns');
        });
        //按钮组-搜索
        $('#iconRefresh').parent().parent().on('click', function(){
          thisPage.search();
        });
      },
      /**获取已选中的主键集合,用法:var kids = thisPage.getKeyIds();if(kids == null){layerFn.alert('请选择要操作的数据', AppKey.code.code199);return;}*/
      getKeyIds : function(){
        var arrays = thisTable.rows({selected : true}).data();//获取已勾选的数据行
        if(arrays.length == 0){
          return null;
        }
        var kids = '';
        for(var i = 0; i < arrays.length; i++){
          var value = arrays[i].kid;
          if(value != ''){
            if(kids.length > 0) kids += ",";
            kids += value;
          }
        }
        return kids;
      },
      initTable : function(){
        var aoColumns = [];
        aoColumns.push({
          data : "buyer",
          sortable : true,
          title : "购买人信息"
        });
        aoColumns.push({
          data : "payee",
          sortable : true,
          title : "收款人信息"
        });
        aoColumns.push({
          data : "orderType",
          sortable : false,
          title : "订单类型",
          render : function(value){
            if(value == 1){
              return "微信订单";
            }else if(value == 2){
              return "积分订单";
            }else{
              return "";
            }
          }
        });
        aoColumns.push({
          data : "buyer_type",
          sortable : false,
          title : "购买类型",
          render : function(value){
            if(value == 1){
              return "消费者购买";
            }else if(value == 2){
              return "门店采购";
            }else if(value == 3){
              return "区代采购";
            }else{
              return "";
            }
          }
        });
        aoColumns.push({
          data : "total_fee",
          sortable : true,
          title : "支付金额",
          render : function(value){
            if(value){
              return '￥'+Decimal(value).toFixed(2);
            }else{
              return "";
            }
          }
        });
        aoColumns.push({
          data : "add_date",
          sortable : true,
          title : "下单时间",
          render : function(value){
            if(value){
              return winFn.formatDate(value,true);/*宽度width: "121px",*/
            }else{
              return "";
            }
          }
        });
        aoColumns.push({
          data : "pay_date",
          sortable : true,
          title : "付款时间",
          render : function(value){
            if(value){
              return winFn.formatDate(value,true);/*宽度width: "121px",*/
            }else{
              return "";
            }
          }
        });
        aoColumns.push({
          data : "_kid_",
          width : "80px",
          title : "<label style='color:#000;margin-left:6px;' title='单行操作'>选项</label>",/*此处的字‘操作选项’请勿修改,此处的文字还有其它用途*/
          sortable : false
        });
        var columnDefs = [];
        columnDefs.push({
          targets : -1,
          render : function(value,type,row,meta){
            return "<a href='javascript:thisPage.rowInfo(" + meta.row + ");' style='outline:none;text-decoration: none;color:#3b8cff;margin-left:6px;'>详情</a>";
          }
        });
        columnDefs.push({
          targets : [0,1,2,3,4,5,6,7],
          render : function(value,type,row,meta){
            return pageDataTable.formatColumn(value);
          }
        });
        columnDefs.push({
          targets : [2,3,4,5,6,7],
          className: "text-center"
        });
        columnDefs.push({
          visible : false,//列的隐藏显示
          targets : []//指定列索引
        });
        thisTable = pageDataTable.initDataTable({
          tableDom : tableDom,
          sAjaxSource : getList,
          fnServerParams : function(params){
            params.push(
              {"name":"userId","value":userId},
              {"name":"storeId","value":storeId}
            );
          },
          aoColumns : aoColumns,
          columnDefs : columnDefs,
          complete : function(settings,data){},//仅执行一次
          footer : function(data,start,end,thLength){},//每次都会执行
          selected : function(selected){
            if(selected){
              //$('#btnDel').removeAttr('disabled');//默认在该button添加属性disabled="disabled"
            }else{
              //$('#btnDel').attr('disabled','disabled');
            }
          },
          rowCallback: function(row,data,index){
            var payeeHtml = "<div class=\"\" style='height:100%;display:flex;flex-direction:column;justify-content:flex-start;padding:0 5px;font-size:12px;'>" +
              "<span style='border-bottom:1px dashed #dedddd;padding:5px;'>账号："+(data.payee || '空')+"</span>" +
              "<span style='border-bottom:1px dashed #dedddd;padding:5px;'>姓名："+(data.payeeName || '空')+"</span>" +
              "<span style='border-bottom:1px dashed #dedddd;padding:5px;word-break:normal; width:auto; display:block; white-space:pre-wrap;word-wrap : break-word ;overflow: hidden;'>昵称："+(data.payeeNick || '空')+"</span></div>";
            var buyerHtml = "<div class=\"\" style='height:100%;display:flex;flex-direction:column;justify-content:flex-start;padding:0 5px;font-size:12px;'>" +
              "<span style='border-bottom:1px dashed #dedddd;padding:5px;'>账号："+(data.buyer || '空')+"</span>" +
              "<span style='border-bottom:1px dashed #dedddd;padding:5px;'>姓名："+(data.buyerName || '空')+"</span>" +
              "<span style='border-bottom:1px dashed #dedddd;padding:5px;word-break:normal; width:auto; display:block; white-space:pre-wrap;word-wrap : break-word ;overflow: hidden;'>昵称："+(data.buyerNick || '空')+"</span></div>";
            $('td', row).eq(0).css('verticalAlign', 'center').html(buyerHtml);
            $('td', row).eq(1).css('verticalAlign', 'center').html(payeeHtml);
          }
        });
        pageDataTable.select(thisTable, tableDom);
        $('.dataTables_scroll .dataTables_scrollBody').removeAttr('style');//解决dataTable表头下拉框被tbody遮挡
      },
      //双击事件
      trDblclick : function(data){
        if(data){
          thisPage.edit(data.kid);
        }
      },
      search : function(){
        if(verifyFn.inputCheck('#page_proxy_btn_listData','没有操作权限')) return;
        thisTable.draw();
      },
      //需要时或为空时才去请求,减轻服务器查询,仅适用于不需要分页的数据,用法:thisPage.getGoods_orders(function(list){});参考项目 wine-frontend/src/main/resources/static/activity.html的getGoods方法
      getGoods_orders : function(callback){
        if(listGoods_order == null){//定义全局的 var listGoods_order = null;//新增或编辑时所需的数据
          layerFn.queryGetHint(urlQueryGoods_order,{},function(data){
            if(AppKey.code.code200 == data.code){
              listGoods_order = data.data;
              callback(listGoods_order);
            }
          });
        }else{
          callback(listGoods_order);
        }
      },
      resetForm: function(){
        winFn.clearFormData('#form_goods_order_edit',[{'dropdownLabel_buyer_type':'选择购买类型'}]);
      },
      edit: function(kid){
        var title = '添加';
        if(kid != null && kid.length > 0){
          if(verifyFn.inputCheck('#page_proxy_row_queryById','没有操作权限')) return;
          title = '编辑';
          layerFn.queryByIdHint(urlQueryById, kid, function(data){
            thisPage.openDialog(title, kid, data);
            //thisPage.editJson(data.data,['ad_img']);//仅在赋值后再执行此代码,更新优化-选项2
          });
        }else{
          thisPage.openDialog(title);
        }
      },
      //移除不需要对比的key(此方法可有可无)
      editJson : function(data,keys){
        if(keys){
          for(var h = 0; h < keys.length; h++){
            delete data[keys[h]];//删除key元素
          }
        }
        stateOriginal = data;
      },
      //对比是否已修改了值,仅需判断必填的字段，文件上传的字段单独处理
      filterValue : function(params){
        if(stateOriginal != null){
          var ignoreKeys = '';
          var requiredKeys = '';
          for(var so in stateOriginal){
            if(params[so] == stateOriginal[so]){
              delete params[so];
              if(ignoreKeys != ''){
                ignoreKeys += ','+so;
              }else{
                ignoreKeys += so;
              }
            }else{
              if(requiredKeys != ''){
                requiredKeys += ','+so;
              }else{
                requiredKeys += so;
              }
            }
          }
          if(ignoreKeys != ''){
            params['ignoreKeys'] = ignoreKeys;//记录后端忽略验证的key以,隔开的字符串,注意数据库字段是否允许为空,可参考项目law-backend的joins.html;law-backend的JoinsService的方法edit();
          }
          if(requiredKeys != ''){
            params['requiredKeys'] = requiredKeys;//记录后端必填验证的key以,隔开的字符串
          }
        }
      },
      openDialog: function(title, kid, map){
        var url = urlAdd;
        if(kid != null && kid.length > 0){
          url = urlEdit;
          if(verifyFn.inputNull('#page_proxy_row_edit','没有编辑权限')) return;
        }else{
          if(verifyFn.inputNull('#page_proxy_btn_add','没有添加权限')) return;
        }
        layerFn.addOrEdit(title,'#div_goods_order_edit', ['450px','680px'], function(layerIndex,layero){
          if(verifyFn.inputNull('#user_id','购买人不能为空')) return;
          if(verifyFn.inputNull('#buyer_type','请选择购买类型')) return;
          if(verifyFn.inputNull('#openId','微信的openId不能为空')) return;
          if(verifyFn.inputNull('#out_trade_no','订单号不能为空')) return;
          if(verifyFn.inputNull('#total_fee','支付金额不能为空')) return;
          if(verifyFn.inputNull('#status','支付状态不能为空')) return;
          if(verifyFn.inputNull('#evaluate','评价状态不能为空')) return;
          if(verifyFn.inputNull('#refund','退款状态不能为空')) return;
          if(verifyFn.inputNull('#version','版本号(乐观锁)不能为空')) return;
          if(verifyFn.inputNull('#body','支付描述（下单描述）不能为空')) return;
          if(verifyFn.inputNull('#add_date','下单时间不能为空')) return;
          var params = {
            payee : winFn.getDomValue('#payee',true),
            user_id : winFn.getDomValue('#user_id',true),
            buyer_type : winFn.getDomValue('#buyer_type',true),
            openId : winFn.getDomValue('#openId',true),
            transaction_id : winFn.getDomValue('#transaction_id',true),
            out_trade_no : winFn.getDomValue('#out_trade_no',true),
            total_fee : winFn.getDomValue('#total_fee',true),
            status : winFn.getDomValue('#status',true),
            evaluate : winFn.getDomValue('#evaluate',true),
            refund : winFn.getDomValue('#refund',true),
            version : winFn.getDomValue('#version',true),
            body : winFn.getDomValue('#body',true),
            notes : winFn.getDomValue('#notes',true),
            add_date : winFn.getDomValue('#add_date',true),
            pay_date : winFn.getDomValue('#pay_date',true),
            kid : kid
          };
          /*thisPage.filterValue(params);//检查是否已修改了数据,更新优化-选项3,如果没有上传功能则可以验证未修改任何值时则不提交
          var validTotal = 0;
          for(var ck in params){
            if(params[ck] != undefined){
              validTotal++;
            }
          }*/
          /*if(validTotal == 0){//没有文件上传时使用此段代码,更新优化-选项4
            layerFn.alert('尚未修改任何数据', AppKey.code.code199);
            return;
          }*/
          layerFn.submit(url,params,function(data){
            thisPage.complete(data,layerIndex,true);
          });
        });
        thisPage.resetForm();
        if(map != null){
          $.each(map.data,function(k,v){
            try{
              if(k == 'buyer_type'){
                winFn.editDropdown('#dropdownLabel_buyer_type','buyer_type' + v);
                return true;
              }
              /*if(k == '需要处理特殊字段field,如复选框或单选框'){
                $('#label_'+goods_id).addClass("hRadio_Checked").prev()[0].checked = true;//赋值,选中
                $('#label_'+goodsId).addClass("checked").prev()[0].checked = true;//赋值,选中
                return true;//跳出本次循环;false跳出循环
              }*/
              $('#' + k).val(v);//若是有问题则把这个放在最前面
            }catch(e){}
          });
        }
      },
      rowInfo: function(index){
        var row = thisTable.row(index).data();
        thisPage.initDialogTable(row.out_trade_no);
      },
      initDialogTable : function(out_trade_no){
        $('#accordion').empty();
        layerFn.queryByIdHint(urlQueryById, out_trade_no, function(data){
          layerFn.winRDom('查看详情','#div_order_info','680px',function(layerIndex,layero){},'关闭');
          var goodsOrder = data.data.goodsOrder || {};
          var orderDetails = data.data.orderDetails || [];
          var outTradeNo = goodsOrder.out_trade_no || '未知';
          var totalFee = goodsOrder.total_fee || '未知';
          var title = goodsOrder.title;
          var panel = "<div class='panel panel-default'><div class='panel-heading' role='tab' id='heading"+'One'+"'></div><div id='collapse"+'One'+"' class='panel-collapse collapse in' role='tabpanel' aria-labelledby='heading"+'One'+"'> </div> </div>";
          var panelTitle = "<h4 class='panel-title'><a style='outline:none;text-decoration:none;' class=\"collapsed\" role=\"button\" data-toggle=\"collapse\" data-parent=\"#accordion\" href=\"#collapseOne\" aria-expanded=\"false\" aria-controls=\"collapseOne\"><div class=\"row\"><div class=\"col-sm-6\"><div>订单编号："+outTradeNo+((title) ? "<br/><span style='font-size:14px;line-height:20px'>活动名称："+title+"</span>":"")+"</div></div><div class=\"col-sm-5 text-right\">销售额：￥"+totalFee+"</div></div></a></h4>";
          var panelBody = "<div class=\"panel-body\"></div>";
          $("#accordion").append(panel);
          $("#headingOne").append(panelTitle);
          $("#collapseOne").append(panelBody);
          for(var i = 0;j=orderDetails.length, i < j; i++){
            var panelBodyContent = "<div class=\"row\"><div class=\"col-sm-3 \"><img style=\"height:80px\" src=\""+webFiles+orderDetails[i].thumbnail+"\" alt=\"商品图片\" class=\"img-thumbnail img-responsive center-block\"></div>" +
              "<div class=\"col-sm-5\"><h4>"+orderDetails[i].contract_name+"</h4><span class=\"label label-primary\" style=\"line-height: 1.25 !important;\">"+orderDetails[i].goodsType+"</span></div>" +
              "<div class=\"col-sm-3\"><h5 class=\"text-right text-primary\">售价：￥"+orderDetails[i].item_fee+"</h5><p class=\"text-right text-muted\" style=\"font-size:14px\">数量："+orderDetails[i].total+ (orderDetails[i].bottles ? ('件 （'+orderDetails[i].bottles+'瓶/件）') : '瓶')+"</p></div>" +
              "</div>";
            if(j > 1){
              panelBodyContent = panelBodyContent + "<div style=\"height:10px\"></div>";
            }
            $("#collapseOne .panel-body").append(panelBodyContent);
          }
        });
      },
      //column指定列名,type:1是普通的文本;2json对象里的value[字段已做转换 JSON_UNQUOTE(JSON_EXTRACT(icon,'$.urlFile')) as icon];3是json对象里含json对象;4是json对象[字段未做转换];
      rowColumnDetails : function(rowIndex,column,type){
        var row = thisTable.row(rowIndex).data();
        var columnValue = row[column];
        if(columnValue != undefined){
          switch (type){
            case 1:
              layerFn.viewValue(columnValue || '暂无数据','430px');
              break;
            case 2:
              window.open(webFiles+columnValue,'_blank').location;
              break;
            case 3:
              break;
            case 4:
              var objs = eval('('+columnValue+')');
              if(objs != undefined && objs.urlFile != undefined){
                window.open(webFiles+objs.urlFile,'_blank').location;
              }else{
                layerFn.alert('暂无数据',AppKey.code.code199);
              }
              break;
            default:
              break;
          }
        }else{
          layerFn.alert('暂无数据',AppKey.code.code199);
        }
      },
      //查看隐藏部分是全部内容,用法 render : function(value,type,row,meta){return thisPage.rowColumnView(value);}
      rowColumnView : function(value){
        if(value == null || value == undefined || value == '') return '';
        value = typeof value === 'string' ? value.replace(/</g, '&lt;').replace(/"/g, '&quot;') : value;//如果提示SyntaxError: expected expression, got '>'错误则注释掉即可
        var len = value.length;
        if(len > 30){
          return "<a href='javascript:layerFn.viewValue(\""+value+"\",\"430px\");' title='点击查看详情' style='outline:none;text-decoration: none;'>"+value.substring(0,30)+"…</a>";
        }else{
          return value;
        }
      },
      complete: function(data,index,search){
        try{
          if(index){
            layerFn.closeIndex(index);
          }
          if(search){
            thisPage.search();
          }
          if(data){
            layerFn.handleResult(data.msg,data.code);
          }
        }catch(e){}
      }
    };
    thisPage.init();
    $('script').remove();
  })(jQuery);
</script>
</body>
</html>